<template>
	<view class="container">
		<view class="money-input"><u-input v-model="money" height="100" type="number" :placeholder="'你最多可转出' + dealer.money + '元'" :custom-style="inputStyle" /></view>
		<view class="money-tips">本次最低可转入{{ settlement.min_money }}元，手续费{{ settlement.dealer_plat_rate }}%！</view>
		<view class="money-btn flex-center-horizontal" @tap="onWithdraw">转出</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			money: '',
			inputStyle: {
				fontSize: '30rpx'
			},
			settlement: {
				plat_rate: 0,
				min_money: 0
			},
			dealer: {
				money: '0'
			},
			disable: false
		};
	},
	onShow() {
		this.getWithdrawData();
	},
	methods: {
		getWithdrawData() {
			this.$u.api.getWithdrawParamInDealer().then(res => {
				this.settlement = res.data.settlement;
				this.dealer = res.data.dealer;
			});
		},
		onWithdraw() {
			if (!this.disable) {
				if (this.money <= 0) {
					this.$u.toast('转出金额必须大于0元');
					return false;
				}
				this.disable = true;
				this.$u.api
					.submitWithdrawParamInDealer(JSON.stringify({ money: this.money }))
					.then(res => {
						this.getWithdrawData();
						uni.showModal({
							title: '提示',
							content: '佣金转出到钱包成功',
							success: res => {
								this.navigateBack();
							}
						});
					})
					.catch(e => {
						this.disable = false;
					});
			}
		}
	}
};
</script>

<style lang="scss">
.money-input {
	margin-top: 20rpx;
	background-color: #fff;
	padding: 0 30rpx;
}
.money-tips {
	height: 70rpx;
	display: flex;
	align-items: center;
	font-size: 22rpx;
	padding: 0 30rpx;
	color: #838383;
}
.money-btn {
	width: 600rpx;
	height: 90rpx;
	background-color: $theme-main-color;
	color: #fff;
	margin: 50rpx auto 0;
	font-size: 32rpx;
	border-radius: 8rpx;
}
</style>
